﻿@page "/activityDetail/{id}"

<div class="activity-content">
    @if (!string.IsNullOrWhiteSpace(_data?.Video))
    {
        <div class="activity-content__item" id="activity-video">
            <div class="activity-content__item-header">
                <MenuTitleInteractiveTrigger InteractiveValue="video" Items="sMenuableTitleItems" Title="视频回放" />
            </div>
            <div class="d-flex justify-center activity-detail__image activity-detail__image-height">
                <iframe _ngcontent-flink-c48=""
                        scrolling="no" border="0" frameborder="no" framespacing="0" width=100%
                        allowfullscreen="allowfullscreen"
                        src="@_data.Video">
                </iframe>
            </div>
        </div>
    }

    @CoverContent(MasaBlazor.Breakpoint.Mobile ? _data?.MobileCover : _data?.Cover);

    @if (!string.IsNullOrWhiteSpace(_data?.File))
    {
        <div class="activity-content__item" id="active-file">
            <div class="activity-content__item-header">
                <MenuTitleInteractiveTrigger InteractiveValue="data" Items="sMenuableTitleItems" Title="资料下载" />
            </div>
            <div class="activity-detail__image">
                <MButton Text Ripple="false" Class="activity-detail__button-text" Href="@_data.File">
                    MASA Framework的设计理念.pdf
                </MButton>
            </div>
        </div>
    }
</div>

@code {

    private RenderFragment CoverContent(string? cover) => __builder =>
    {
        if (!string.IsNullOrWhiteSpace(cover))
        {
            <div class="activity-content__item" id="activity-detail">
                <div class="activity-content__item-header">
                    <MenuTitleInteractiveTrigger InteractiveValue="detail" Items="sMenuableTitleItems" Title="活动详情" />
                </div>
                <div class="activity-detail__image">
                    <img src="@cover" width="100%" />
                </div>
            </div>
        }
    };

}
